<template>
  <div class="homeContainer">
    <div v-if="firstProject">
      <Guide @setRead="setRead" />
    </div>
    <div v-else class="container">
      <!-- 头部信息 -->
      <div class="titleWrap">
        <el-row class="topBox">
          <div class="fl">
            <el-select
              v-model="projectId"
              value-key="projectId"
              filterable
              placeholder="暂无关联项目"
            >
              <el-option
                v-for="(item, index) of projectList"
                :key="index"
                :label="item.projectName"
                :value="item.projectId"
                :title="item.projectName"
                @click.native="changeProject(item.projectId, item.projectName)"
              ></el-option>
            </el-select>
          </div>
          <div class="fl">
            <span
              class="projectState greenBack"
              v-if="topInfo.state === 'STARTED'"
              >已开工
            </span>
            <span
              class="projectState yellowBack"
              v-if="topInfo.state === 'NOT_STARTED'"
              >未开工</span
            >
            <span
              class="projectState greyBack"
              v-if="topInfo.state === 'COMPLETED'"
              >已竣工</span
            >
            <span
              class="projectState redBack"
              v-if="topInfo.state === 'STOPPED'"
              >已停工</span
            >
            <span
              class="startStatus startFinished"
              v-show="topInfo.state == 'FINISHED'"
              >已完工</span
            >

            <!-- 是否小项目 -->
            <span class="startStatus miniStart" v-if="isMini">小项目</span>
            <el-link type="primary" v-if="isMini" @click="lookRule"
              >小项目管理规则</el-link
            >
            <!-- 昆明项目服务到期，需要改文案 -->
            <span class="redColor" v-if="isKMUser() && overDate == 1"
              >(服务{{
                projectService.state == 'NORMAL' ? '正常' : '即将到期'
              }},服务时间：{{ projectService.startDate }}至{{
                projectService.endDate
              }},剩余：{{ getLastTime() }}）</span
            >
            <span
              class="redColor"
              v-if="isKMUser() && overDate == 2 && projectService.startDate"
            >
              <span v-if="projectService.state == 'SERVICE_DUE'"
                >(服务已到期,服务时间：{{ projectService.startDate }}至{{
                  projectService.endDate
                }}, 2021-09-22日后，账号将停止使用）</span
              >
              <span v-else
                >(服务{{
                  projectService.state == 'NORMAL' ? '正常' : '即将到期'
                }},服务时间：{{ projectService.startDate }}至{{
                  projectService.endDate
                }},剩余：{{ getLastTime() }}）</span
              >
            </span>
            <span
              class="redColor"
              v-if="isKMUser() && overDate == 2 && !projectService.startDate"
              >(项目服务未开通，2021-09-22日后，账号将停止使用）</span
            >
          </div>
        </el-row>
        <el-row class="explain">
          于
          <span>{{ topInfo.createTime }}</span>
          建档，于
          <span>{{ topInfo.date }}</span>
          开工，建设周期{{ topInfo.period }}天
          <span v-show="topInfo.endDay >= 0">，距离计划竣工还剩</span>
          <span v-show="topInfo.endDay < 0">，超出计划竣工</span>
          <span>{{ Math.abs(topInfo.endDay) || '--' }}</span>
          <span>天</span>
          <el-link
            type="primary"
            class="seeDetail"
            v-show="isShowDetail"
            @click="seeProjectDetail"
            >查看项目详情>></el-link
          >
          <span v-if="isShowUpdate" class="untrue">信息不正确？</span>
          <el-link
            v-if="isShowUpdate"
            type="primary"
            class="updateInfo"
            @click="updateProjectInfo"
            >去修改>></el-link
          >
          <div
            class="historyChange fr"
            v-if="isShowStatuChange"
            style="margin-top: -40px"
          >
            <el-button
              class="greenBack saveBtn"
              style="width: 110px; height: 36px; padding: 0"
              @click="statusChange"
              >项目状态变更</el-button
            >
          </div>
          <div
            class="historyChange fr"
            v-if="isShowDetail"
            @click="toHistoryChange"
          >
            项目历史状态变更
          </div>
        </el-row>
        <el-row class="titleBottom" style="margin-right: 20px">
          维权公示牌：{{ topInfo.hasUpload }}
          <el-upload
            v-if="topInfo.hasUpload === '未上传'"
            class="upload-demo inline-block"
            :action="uploadUrl"
            :data="uploadData"
            :on-success="uploadSuccess"
            :on-error="uploadError"
            :before-upload="limitSize"
            accept=".jpg, .jpeg, .png, .PNG, .JPG, .JPEG"
            list-type="picture"
          >
            <el-link type="primary">点击上传</el-link>
          </el-upload>
          <el-upload
            v-if="topInfo.hasUpload === '已上传'"
            class="upload-demo inline-block"
            :action="uploadUrl"
            :data="uploadData"
            :on-success="changeUploadSuccess"
            :on-error="uploadError"
            :before-upload="limitSize"
            accept=".jpg, .jpeg, .png, .PNG, .JPG, .JPEG"
            list-type="picture"
          >
            <el-link type="primary">点击替换</el-link>
          </el-upload>
          <div class="inline-block previewBox">
            <el-link
              type="primary"
              v-show="topInfo.hasUpload === '已上传'"
              @click="showPic('publicSignCon')"
              >点击预览</el-link
            >
            <el-image
              class="previewImg"
              v-if="topInfo.hasUpload === '已上传'"
              style="width: 56px; height: 0px"
              :src="publicSign.imgUrl"
              :preview-src-list="publicSign.srcList"
              id="publicSignCon"
            ></el-image>
          </div>
          <div
            class="inline-block previewBox"
            style="margin-left: 8px"
            v-show="isShowSeeExample"
          >
            <el-link
              type="primary"
              @click="showPic('seeExampleBox')"
              v-show="checkImg(seeExample.imgUrl)"
              >查看范例</el-link
            >
            <el-image
              class="previewImg"
              style="width: 56px; height: 0px"
              :src="seeExample.imgUrl"
              :preview-src-list="seeExample.srcList"
              id="seeExampleBox"
              v-show="checkImg(seeExample.imgUrl)"
            ></el-image>
            <el-link
              type="primary"
              v-show="!checkImg(seeExample.imgUrl)"
              @click="lookResult(seeExample.imgUrl)"
              >查看范例</el-link
            >
          </div>
        </el-row>
        <el-row class="titleBottom" v-if="isWhUser()">
          <span
            >项目现场情况：{{ topInfo.hasLiveSitUpload }}
            <el-upload
              v-if="topInfo.hasLiveSitUpload === '未上传'"
              class="upload-demo inline-block"
              :action="uploadUrl"
              :data="xcUploadData"
              :on-success="xcUploadSuccess"
              :on-error="uploadError"
              :before-upload="limitSize"
              accept=".jpg, .jpeg, .png, .PNG, .JPG, .JPEG"
              list-type="picture"
            >
              <el-link type="primary">点击上传</el-link>
            </el-upload>
          </span>
          <el-upload
            v-if="topInfo.hasLiveSitUpload === '已上传'"
            class="upload-demo inline-block"
            :action="uploadUrl"
            :data="xcUploadData"
            :on-success="xcChangeUploadSuccess"
            :on-error="uploadError"
            :before-upload="limitSize"
            accept=".jpg, .jpeg, .png, .PNG, .JPG, .JPEG"
            list-type="picture"
          >
            <el-link type="primary">点击替换</el-link>
          </el-upload>
          <div class="inline-block previewBox">
            <el-link
              type="primary"
              v-show="topInfo.hasLiveSitUpload === '已上传'"
              @click="showPic('liveSitsuation')"
              >点击预览</el-link
            >
            <el-image
              class="previewImg"
              v-if="topInfo.hasLiveSitUpload === '已上传'"
              style="width: 56px; height: 0px"
              :src="publicSign.xcImgUrl"
              :preview-src-list="publicSign.xcSrcList"
              id="liveSitsuation"
            ></el-image>
          </div>
        </el-row>
        <div class="topBtn" v-if="isShowBut">
          <!--  v-if="companyType === 'JS'" -->
          <el-button
            type="danger"
            @click="openDialog('stop')"
            v-show="
              topInfo.state === 'STARTED' ||
              (topInfo.state === 'NOT_STARTED' && isShowUpdate)
            "
            >设置停工</el-button
          >
          <el-button
            type="danger"
            class="greenBack"
            @click="openDialog('over')"
            v-show="
              topInfo.state === 'STARTED' ||
              topInfo.state === 'NOT_STARTED' ||
              (topInfo.state === 'FINISHED' && isShowUpdate)
            "
            >设置竣工</el-button
          >
          <el-button
            type="danger"
            class="greenBack"
            @click="openDialog('againStart')"
            v-show="
              topInfo.state === 'STOPPED' ||
              (topInfo.state === 'NOT_STARTED' && isShowUpdate)
            "
            >设置开工</el-button
          >
          <el-button
            type="danger"
            class="greenBack"
            @click="openDialog('finish')"
            v-show="
              topInfo.state === 'STARTED' ||
              (topInfo.state === 'NOT_STARTED' && isShowUpdate)
            "
            >设置完工</el-button
          >
        </div>
      </div>
      <!-- 风险项目 -->
      <!-- 顶部提示 -->
      <!-- 暂时隐藏，请勿删掉代码 -->
      <div class="topTip" v-if="isShowDanger">
        <div class="dangerBox">
          <div class="leftBox">项目风险</div>
          <div class="rightBox">
            <el-carousel
              height="32px"
              indicator-position="none"
              direction="vertical"
              v-if="dangerousDataTotal > 0"
            >
              <el-carousel-item
                v-for="(item, index) in dangerousProjects"
                :key="index"
              >
                <el-row>
                  <el-col :span="12" class="cursor ellipsis">
                    <span
                      @click="
                        skipProjectDanger(
                          item.projectId,
                          '/home/enterpriseScore/projectScoreList',
                          item.projectScoreId
                        )
                      "
                      >{{ item.projectName }}</span
                    >
                    <span
                      @click="
                        skipProjectDanger(
                          item.projectId,
                          '/home/enterpriseScore/projectScoreList',
                          item.projectScoreId
                        )
                      "
                      class="redColor"
                      >{{ item.reason }}</span
                    >
                  </el-col>
                  <el-col
                    :span="12"
                    class="cursor ellipsis"
                    v-if="item.projectNameRight"
                  >
                    <span
                      @click="
                        skipProjectDanger(
                          item.projectIdRight,
                          '/home/enterpriseScore/projectScoreList',
                          item.projectScoreIdRight
                        )
                      "
                      >{{ item.projectNameRight }}</span
                    >
                    <span
                      @click="
                        skipProjectDanger(
                          item.projectIdRight,
                          '/home/enterpriseScore/projectScoreList',
                          item.projectScoreIdRight
                        )
                      "
                      class="redColor"
                      >{{ item.reasonRight }}</span
                    >
                  </el-col>
                </el-row>
              </el-carousel-item>
            </el-carousel>
            <div v-else>暂无风险项目</div>
          </div>
        </div>
      </div>
      <!-- 主体部分 -->
      <div class="mainSection">
        <!-- 左边模块 -->
        <div class="contentLeft">
          <!-- 项目评价 -->
          <div class="scoreBox" v-if="isShowScore">
            <el-row class="scoreBox">
              <el-col :span="7" class="scoreLeft">
                <div class="title" style="text-align: left">项目动态评价</div>
                <p
                  v-if="gradeLevel"
                  style="
                    font-size: 64px;
                    color: #333333;
                    margin-top: 45px;
                    font-family: Microsoft YaHei;
                  "
                >
                  {{ gradeLevel }}
                </p>
                <img
                  v-else
                  src="../../../static/img/level/noLevel.png"
                  class="projectLevel"
                />
                <!-- <img
                    v-if="!gradeLevel"
                    src="../../../static/img/level/noLevel.png"
                    class="projectLevel"
                    /> -->
                <!-- <img
                    v-if="gradeLevel == 'A'"
                    src="../../../static/img/level/A.png"
                    class="projectLevel"
                    />
                    <img
                    v-if="gradeLevel == 'B'"
                    src="../../../static/img/level/B.png"
                    class="projectLevel"
                    />
                    <img
                    v-if="gradeLevel == 'C'"
                    src="../../../static/img/level/C.png"
                    class="projectLevel"
                    />
                    <img
                    v-if="gradeLevel == 'D'"
                    src="../../../static/img/level/D.png"
                    class="projectLevel"
                    /> -->
                <el-row>
                  <el-button
                    v-if="gradeLevel"
                    round
                    plain
                    class="xfButton"
                    @click="xfCredit('/home/enterpriseScore/projectScoreList')"
                    >修复评价</el-button
                  >
                </el-row>
              </el-col>
              <el-col :span="17">
                <div class="todoBox">
                  <p class="modularTitle">待办事项</p>
                  <el-tabs v-model="activeName">
                    <el-tab-pane label="待处理预警" name="first">
                      <ul v-if="alertTotal > 0" class="todoContentBox">
                        <li v-for="(item, index) of alertData" :key="index">
                          <el-col :span="10">{{ item.generateTime }}</el-col>
                          <el-col :span="10">{{ item.typeName }}</el-col>
                          <el-col
                            :span="4"
                            :class="{
                              dealing: item.statusDesc == '处理中',
                              noDeal: item.statusDesc == '未处理',
                            }"
                            >{{ item.statusDesc }}</el-col
                          >
                        </li>
                      </ul>
                      <el-row
                        v-if="alertTotal > 4"
                        class="alignCenter moreLink"
                      >
                        <el-link
                          type="primary"
                          :underline="false"
                          @click="
                            skipAlert('/home/project/constructAlertProjectList')
                          "
                          >查看更多>></el-link
                        >
                      </el-row>
                      <div v-if="alertTotal == 0" class="alignCenter noData">
                        暂无待处理预警
                      </div>
                    </el-tab-pane>
                    <el-tab-pane label="待处理审核" name="second">
                      <ul v-if="checkTotal > 0" class="todoContentBox">
                        <li v-for="(item, index) of checkData" :key="index">
                          <el-col :span="10">{{ item.applyDate }}</el-col>
                          <el-col :span="10">{{ item.name }}</el-col>
                          <el-col
                            :span="4"
                            :class="{
                              dealing: item.statusDesc == '待完善',
                              noDeal: item.statusDesc == '待处理',
                            }"
                            >{{ item.statusDesc }}</el-col
                          >
                        </li>
                      </ul>
                      <el-row
                        v-if="checkTotal > 4"
                        class="alignCenter moreLink"
                      >
                        <el-link
                          type="primary"
                          :underline="false"
                          @click="
                            skipApplyEmployee(
                              '/home/employee/projectEmployeeApply'
                            )
                          "
                          >查看更多>></el-link
                        >
                      </el-row>
                      <div v-if="checkTotal == 0" class="alignCenter noData">
                        暂无待处理审核
                      </div>
                    </el-tab-pane>
                  </el-tabs>
                </div>
              </el-col>
            </el-row>
          </div>
          <!-- 分账管理 -->
          <div class="accountBox">
            <div class="title">分账管理制度落实情况</div>
            <el-row v-if="hasSalaryAccount">
              <el-col :span="10" class="accountLeft">
                <ul>
                  <li>
                    <span class="label">专户银行</span>
                    <span class="information">{{
                      accountInfo.bankName || '0'
                    }}</span>
                  </li>
                  <li>
                    <span class="label">专户名称</span>
                    <span class="information">{{
                      accountInfo.accountName || '--'
                    }}</span>
                  </li>
                  <li>
                    <span class="label">专户账号</span>
                    <span class="information">{{
                      accountInfo.account | deseHandler(4, 4, '*')
                    }}</span>
                  </li>
                  <li>
                    <span class="label">签约状态</span>
                    <span class="information" v-if="accountInfo.signed === 1"
                      >已签约</span
                    >
                    <span class="information" v-if="accountInfo.signed === 0"
                      >未签约</span
                    >
                  </li>
                </ul>
              </el-col>
              <el-col :span="14" class="accountRight">
                <div class="bankInfo">
                  <div class="payoff">
                    <div>
                      <p class="color999">专户缴存总额（万元）</p>
                      <p class="moneyAll fontColorTheme">
                        {{ accountInfo.payTotal | splitNumber }}
                      </p>
                    </div>
                    <div>
                      <p class="color999">专户缴存余额（万元）</p>
                      <p class="moneyLittle">
                        {{ accountInfo.balance | splitNumber }}
                      </p>
                    </div>
                  </div>
                  <p class="color999">专户应缴金额（万元）</p>
                  <p class="moneyLittle">
                    {{ accountInfo.shouldDisburseTotal | splitNumber }}
                  </p>
                  <el-link
                    type="primary"
                    class="updateInfo"
                    @click="toDetail(accountInfo.disbursePlanId)"
                    v-if="isHsUser()"
                    >查看拨付计划</el-link
                  >
                  <span class="color999" v-if="isHsUser()"
                    >如与实际人工费拨付情况不符，请联系监察申请修改</span
                  >
                </div>
              </el-col>
            </el-row>
            <div v-else class="noRealName">
              <p>
                <i class="iconfont iconjingshi"></i>
                <span>您还未添加专户信息，请尽快添加！</span>
              </p>
              <el-button
                class="commonBut saveBtn addEmployee"
                icon="iconfont icontianjia"
                @click="
                  addAccountInfo('/home/specialAccount/specialAccountList')
                "
              >
                <span class="opetareText">添加专户</span>
              </el-button>
            </div>
          </div>
          <!-- 实名制 -->
          <div class="reactBox">
            <div class="title">实名制管理制度落实情况</div>
            <div class="keyWrapper" style="height: 204px">
              <!-- 企业端实名制为空的时候显示 -->
              <div v-if="noRealName" class="noRealName">
                <p>
                  <i class="iconfont iconjingshi"></i>
                  <span>您还未添加实名制信息，请尽快添加！</span>
                </p>
                <el-button
                  class="commonBut saveBtn addEmployee"
                  icon="iconfont icontianjia"
                  @click="addEmployee('/home/employee/projectEmployeeQY')"
                >
                  <span class="opetareText">添加人员</span>
                </el-button>
              </div>
              <ul v-else>
                <li class="keyBox">
                  <p class="keyName">实名制总人数</p>
                  <p>
                    <span class="quantity fontColorTheme">{{
                      employeeInfo.projectRealNameTotalCount || '0'
                    }}</span>
                    <span class="keyName">人</span>
                  </p>
                </li>
                <li class="keyBox">
                  <p class="keyName">本月新增人数</p>
                  <p>
                    <span class="quantity fontColorTheme">{{
                      employeeInfo.projectThisMonthRealNameCount || '0'
                    }}</span>
                    <span class="keyName">人</span>
                  </p>
                </li>
                <li class="keyBox">
                  <p class="keyName">总考勤数</p>
                  <p>
                    <span class="quantity fontColorTheme">{{
                      employeeInfo.projectTotalAttCount || '0'
                    }}</span>
                    <span class="keyName">次</span>
                  </p>
                </li>
                <li class="keyBox">
                  <p class="keyName">本月考勤数</p>
                  <p>
                    <span class="quantity fontColorTheme">{{
                      employeeInfo.projectThisMontAttCount || '0'
                    }}</span>
                    <span class="keyName">次</span>
                  </p>
                </li>
                <li class="keyBox" v-if="!isHsUser()">
                  <p class="keyName">实名制合同签订比例</p>
                  <p class="quantity fontColorTheme">
                    {{ employeeInfo.signNameContractReal || '0' }}%
                  </p>
                </li>
                <li class="keyBox" v-if="!isHsUser()">
                  <p class="keyName">实名制考勤比例</p>
                  <p class="quantity fontColorTheme">
                    {{ employeeInfo.signNameAttReal || '0' }}%
                  </p>
                </li>
              </ul>
            </div>
          </div>
          <!-- 今日考勤状概况 -->
          <div class="attBox">
            <div class="title">
              今日考勤概况
              <el-tooltip content="Top center" placement="top" effect="dark">
                <div slot="content">
                  数据将实时同步，可能与其他统计数据不一致
                </div>
                <i class="icon iconfont iconhuabanfuben"></i>
              </el-tooltip>
            </div>
            <div class="attDataBox clearfix">
              <div class="leftBox fl">
                <div ref="todayAtt" class="todayAtt"></div>
                <div>
                  <ul>
                    <li>
                      <span class="labelTitle">项目在职人数：</span
                      ><span class="content fontColorTheme"
                        >{{ empOnJob }}人</span
                      >
                    </li>
                    <li>
                      <span class="labelTitle">今日出勤人数：</span
                      ><span class="content fontColorTheme"
                        >{{ attTodayTotal }}人</span
                      >
                    </li>
                    <li>
                      <span class="labelTitle">考勤率：</span
                      ><span class="content fontColorTheme"
                        >{{ attTotalRate }}%</span
                      >
                    </li>
                  </ul>
                </div>
              </div>
              <div class="rightBox fr">
                <el-table
                  :data="tableData"
                  :header-cell-style="{
                    background: '#eef1f6',
                    color: '#606266',
                  }"
                  v-loading="loadingAll"
                  :tree-props="{
                    children: 'children',
                    hasChildren: 'hasChildren',
                  }"
                  lazy
                  style="width: 100%"
                  :load="load"
                  row-key="id"
                  border
                  height="275"
                  ref="table"
                  :row-style="{ height: '0' }"
                  :cell-style="{ padding: '11px' }"
                >
                  <!-- <el-table-column prop="name" label="所属单位"  :show-overflow-tooltip="true" align="left" width="200px"></el-table-column> -->
                  <el-table-column label="所属单位" width="230">
                    <template slot-scope="scope">
                      <copyText
                        :tableIndex="scope.$index"
                        :copyTextName="scope.row.name"
                        :columnName="'name'"
                      ></copyText>
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="empOnJobTotal"
                    label="在职人数（人）"
                  ></el-table-column>
                  <el-table-column
                    prop="attTodayTotal"
                    label="今日出勤人数（人）"
                  ></el-table-column>
                  <el-table-column prop="attTotalRate" label="考勤率">
                    <template slot-scope="scope">
                      {{
                        scope.row.attTotalRate == '0'
                          ? '0'
                          : scope.row.attTotalRate + '%'
                      }}
                    </template>
                  </el-table-column>
                  <!-- 表格数据为空时，页面显示 -->
                  <div slot="empty" v-show="isShow">
                    <emptyTable emptyText="暂无相关数据"></emptyTable>
                  </div>
                </el-table>
              </div>
            </div>
          </div>
          <!-- 工资代发 -->
          <div class="salaryBox">
            <div class="title">
              工资代发制度落实情况
              <span class="smallTitle" v-if="salaryDay"
                >（每月{{ salaryDay || '--' }}日为工资发放日）</span
              >
            </div>
            <div class="keyWrapper">
              <!-- 企业端工资代发为空的时候显示 -->
              <div v-if="noSalary" class="noSalary">
                <p>请补充工资专户信息及项目工人后制作工资表</p>
              </div>
              <ul v-else>
                <li class="keyBox">
                  <p class="keyName">代发总金额</p>
                  <p>
                    <span class="quantity fontColorTheme">{{
                      salaryInfo.projectRealNameTotalCount || '0'
                    }}</span>
                    <span class="keyName">万元</span>
                  </p>
                </li>
                <li class="keyBox">
                  <p class="keyName">代发总人次</p>
                  <p>
                    <span class="quantity fontColorTheme">{{
                      salaryInfo.bankActPayTotal || '0'
                    }}</span>
                    <span class="keyName">人</span>
                  </p>
                </li>
                <li class="keyBox" v-if="!isHsUser()">
                  <p class="keyName">工资代发比例</p>
                  <p>
                    <span class="quantity fontColorTheme"
                      >{{ salaryInfo.salaryPayRatio || '0' }}%</span
                    >
                  </p>
                </li>
                <li class="keyBox" v-if="!isHsUser()">
                  <p class="keyName fontSize">工资确认比例（工资表附件）</p>
                  <p class="quantity fontColorTheme">
                    {{ salaryInfo.salaryConfirmFileRatio || '0' }}%
                  </p>
                </li>
                <li class="keyBox">
                  <p class="keyName fontSize">工资确认比例（手机app）</p>
                  <p class="quantity fontColorTheme">
                    {{ salaryInfo.salaryConfirmAPPRatio || '0' }}%
                  </p>
                </li>
              </ul>
            </div>
          </div>
        </div>
        <!-- <div class="leftSection">
            </div>-->
        <!-- 右边模块 -->
        <div class="rightSection">
          <transition name="fade">
            <img
              src="../../../static/img/projectDetail/qrcode.png"
              v-if="qrcode"
              class="qrcode"
              @mouseover="mouseOver"
            />
            <div
              class="qrcodeBox boxShadow"
              v-if="qrcodeImgCon"
              @mouseleave="mouseleave"
            >
              <img
                src="../../../static/img/projectDetail/qrcode.png"
                class="qrcodeTwo"
              />
              <img :src="qrcodeBoxUrl" alt />
              <div class="content">
                1.使用工匠365APP扫一扫即可
                <br />快速录入人员加入本项目； <br />2.使用和谐用工APP扫一扫可快
                <br />速查看项目信息。 <br />※建议
                <a
                  href="javascript:;"
                  download="二维码"
                  @click="downLoad"
                  class="driveDownload"
                  >下载</a
                >后打印，与维权公示牌一同张贴
              </div>
            </div>
          </transition>
          <!-- 快捷功能盒子 -->
          <div class="functionAndQrcodeBox clearfix">
            <div class="functionBox fl">
              <p class="modularTitle">快捷功能</p>
              <div class="functionBtn fl">
                <el-button
                  class="commonBut saveBtn functionItemChange"
                  icon="iconfont icontianjiarenyuan"
                  @click="addEmployee('/home/employee/projectEmployeeQY')"
                  >添加人员</el-button
                >
              </div>
              <div class="functionBtn fr">
                <el-button
                  class="commonBut saveBtn functionItemChange"
                  icon="iconfont icongongzidaifa"
                  @click="makeSalary('/home/salaryDf/companySalaryBatchList')"
                  >工资代发</el-button
                >
              </div>
            </div>
          </div>
          <div class="waitAlertBox">
            <div class="titleWord">待处理预警</div>
            <div class="contentBox" v-if="alertTotal > 0">
              <el-row v-for="(item, index) of alertData" :key="index">
                <el-col :span="10" class="ellipsis">{{
                  item.generateTime
                }}</el-col>
                <el-col :span="10" class="ellipsis">{{ item.typeName }}</el-col>
                <el-col :span="4">
                  <el-link
                    type="primary"
                    @click="
                      seeAlertDetail(
                        item.id,
                        '/home/project/constructAlertProjectList'
                      )
                    "
                    >去处理</el-link
                  >
                </el-col>
              </el-row>
              <el-row class="alignCenter" v-if="alertTotal > 3">
                <el-link
                  type="primary"
                  @click="skipAlert('/home/project/constructAlertProjectList')"
                  >查看更多预警>></el-link
                >
              </el-row>
            </div>
            <div v-else class="noData">暂无待处理预警</div>
          </div>
          <!-- 政策要点 -->
          <div class="policyBox" id="niceScroll">
            <div class="titleWord">政策要点</div>
            <ul class="contentBox clearfix" v-if="policyTotal > 0">
              <li
                style="width: 100%; height: 70px"
                v-for="(item, index) of policyData"
                :key="index"
                class="fl"
              >
                <span>【{{ item.infoTypeDesc }}】</span>
                <span class="noticeTitle" :title="item.title"
                  >{{ item.title }} {{ func('noticeTitle') }}</span
                >
                <el-link
                  type="primary"
                  class="fr seeContent"
                  @click="
                    skipPolicy(
                      item.id,
                      item.title,
                      item.type,
                      item.range,
                      '/home/notice/inforList'
                    )
                  "
                  >查看全文>></el-link
                >
              </li>
            </ul>
            <div v-else class="noData">暂无政策要点数据</div>
          </div>
          <!-- 保证金 -->
          <div class="bzjBox">
            <div class="title">工资保证金制度落实情况</div>
            <div v-if="!bzjInfo.hasDeposit" class="noDeposit">
              <p>暂无工资保证金制度落实情况信息</p>
            </div>
            <!-- <div v-else> -->
            <div v-else>
              <ul class="clearfix">
                <li class="clearfix">
                  <span class="labelWidth">缴纳情况：</span>
                  <span class="information" v-if="bzjInfo.hasDeposit == true"
                    >有缴纳记录</span
                  >
                  <span class="information" v-if="bzjInfo.hasDeposit == false"
                    >无缴纳记录</span
                  >
                </li>
                <li class="clearfix">
                  <span class="labelWidth">动用情况：</span>
                  <span class="information" v-if="bzjInfo.isExpenditure == '1'"
                    >有动用记录</span
                  >
                  <span class="information" v-else>无动用记录</span>
                </li>
                <li class="clearfix">
                  <span class="labelWidth">最新状态：</span>
                  <span class="information">{{
                    bzjInfo.statusDesc || '--'
                  }}</span>
                </li>
                <li class="clearfix">
                  <span class="labelWidth">缴纳比例：</span>
                  <span class="information">{{ bzjInfo.scale || '0' }}%</span>
                </li>
                <li class="clearfix">
                  <span class="labelWidth">应缴金额：</span>
                  <span class="information"
                    >{{ bzjInfo.shouldPayTotal || '0' }}元</span
                  >
                </li>
                <li class="clearfix">
                  <span class="labelWidth">实缴金额：</span>
                  <span class="information"
                    >{{ bzjInfo.payTotal || '0' }}元</span
                  >
                </li>
                <li class="clearfix">
                  <span class="labelWidth">余额：</span>
                  <span class="information"
                    >{{ bzjInfo.balance || '0' }}元</span
                  >
                </li>
              </ul>
            </div>
          </div>
          <!-- <div v-else class="bzjBox" style = "height:auto;position: relative;">
                  <img src="../../../static/img/newInsurance/NEW.png" alt="" style = "position: absolute;top:0;left:0">
                  <div class="title">农民工工资保证金第三方担保</div>
                  <div class = "labelTitle">以第三方担保代替农民工工资保证金缴存，优化营商环境，减轻企业负担；释放企业资金活力，发挥企业资金效能。</div>
                  <div style = "margin-top: 12px;text-align: right;">
                    <el-button class="commonBut saveBtn funComBut"  v-sdc @click="toRegister">
                      登记信息
                    </el-button>
                  </div>
                </div> -->
          <!-- 工商保险盒子 -->
          <div class="insuranceBox">
            <div class="titleBox">
              <p class="modularTitle">工伤保险信息</p>
            </div>
            <div class="contentBox">
              <div v-if="!hasInsurance" class="noInsurance">
                <p>
                  <i class="iconfont iconjingshi"></i>
                  <span>请添加工伤保险信息！</span>
                </p>
                <el-button
                  class="commonBut saveBtn addInsurance"
                  icon="iconfont icontianjia"
                  @click="skipAddInsurrance"
                >
                  <span class="opetareText">添加保险</span>
                </el-button>
              </div>
              <ul v-else>
                <li class="color333 fontBold">首次参保</li>
                <li>
                  <label for>参保时间：</label>
                  <span>{{ insuranceInfo.insDate || '--' }}</span>
                </li>
                <li class="ellipsis">
                  <label for>参保单位：</label>
                  <span :title="insuranceInfo.companyName">{{
                    insuranceInfo.companyName || '--'
                  }}</span>
                </li>
                <li class="ellipsis">
                  <label for>投保单位：</label>
                  <span :title="insuranceInfo.bureau">{{
                    insuranceInfo.bureau || '--'
                  }}</span>
                </li>
                <li>
                  <template v-if="!isEsUser()">
                    <span>参保人数：</span>
                    <span>{{ insuranceInfo.total || '0' }}</span>
                  </template>
                  <template v-else>
                    <span
                      >累计备案人数：{{ recordInfo.empCount || '0' }}人</span
                    >
                  </template>
                </li>
                <li v-show="insuranceTotal > 1" class="alignCenter">
                  <el-link
                    type="primary"
                    :underline="false"
                    @click="
                      skipInsurrance(
                        isEsUsers
                          ? '/home/EsInsurance/EsInsurance'
                          : '/home/insurance/insurance'
                      )
                    "
                    >查看更多>></el-link
                  >
                </li>
              </ul>
            </div>
          </div>
        </div>
      </div>
      <!-- 弹窗 -->
      <el-dialog
        title="设置停工"
        :visible.sync="formStopVisible"
        :close-on-click-modal="false"
        @close="closeDialog('stop')"
        custom-class="brand-dialog-min-width"
        width="640px"
        :modal-append-to-body="false"
      >
        <el-form
          :model="formDataStop"
          label-width="80px"
          :rules="formRulesStop"
          ref="formDataStop"
        >
          <el-form-item label="停工日期" prop="operateDate">
            <el-date-picker
              type="date"
              placeholder="请选择停工开始的日期"
              v-model="formDataStop.operateDate"
              value-format="yyyy-MM-dd"
              :picker-options="pickerOptions"
            ></el-date-picker>
          </el-form-item>
          <el-form-item label="停工原因" prop="operateReason">
            <el-input
              type="textarea"
              v-model="formDataStop.operateReason"
              autocomplete="off"
              placeholder="请输入停工原因"
              maxlength="200"
              rows="3"
              class="mWidth"
              show-word-limit
            ></el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click.native="cancelEdit('stop')" class="cancel"
            >取消</el-button
          >
          <el-button
            type="primary"
            @click.native="updateProjectState('stop', 'formDataStop')"
            class="save"
            >保存</el-button
          >
        </div>
      </el-dialog>
      <el-dialog
        title="设置竣工"
        :visible.sync="formOverVisible"
        :close-on-click-modal="false"
        @close="closeDialog('over')"
        custom-class="brand-dialog-min-width"
        width="32%"
        :modal-append-to-body="false"
      >
        <el-form
          :model="formDataOver"
          label-width="80px"
          :rules="formRulesOver"
          ref="formDataOver"
        >
          <el-form-item label="竣工日期" prop="operateDate">
            <el-date-picker
              type="date"
              placeholder="请选择项目实际竣工的日期"
              v-model="formDataOver.operateDate"
              value-format="yyyy-MM-dd"
              :picker-options="pickerOptions"
            ></el-date-picker>
          </el-form-item>
          <el-form-item label="竣工原因" prop="operateReason">
            <el-input
              type="textarea"
              v-model="formDataOver.operateReason"
              autocomplete="off"
              placeholder="请输入竣工原因"
              maxlength="200"
              show-word-limit
            ></el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click.native="cancelEdit('over')" class="cancel"
            >取消</el-button
          >
          <el-button
            type="primary"
            @click.native="updateProjectState('over', 'formDataOver')"
            class="save"
            >保存</el-button
          >
        </div>
      </el-dialog>
      <el-dialog
        title="恢复开工"
        :visible.sync="formAgainStartVisible"
        :close-on-click-modal="false"
        @close="closeDialog('againStart')"
        custom-class="brand-dialog-min-width"
        width="32%"
        :modal-append-to-body="false"
      >
        <el-form
          :model="formDataAgainStart"
          label-width="80px"
          :rules="formRulesAgainStart"
          ref="formDataAgainStart"
        >
          <el-form-item label="恢复日期" prop="operateDate">
            <el-date-picker
              type="date"
              placeholder="请选择开工开始的日期"
              v-model="formDataAgainStart.operateDate"
              value-format="yyyy-MM-dd"
              :picker-options="pickerOptions"
            ></el-date-picker>
          </el-form-item>
          <el-form-item label="恢复原因" prop="operateReason">
            <el-input
              type="textarea"
              v-model="formDataAgainStart.operateReason"
              autocomplete="off"
              placeholder="请输入恢复原因"
              maxlength="200"
              show-word-limit
            ></el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click.native="cancelEdit('againStart')" class="cancel"
            >取消</el-button
          >
          <el-button
            type="primary"
            @click.native="updateProjectState('start', 'formDataAgainStart')"
            class="save"
            >保存</el-button
          >
        </div>
      </el-dialog>
      <el-dialog
        title="设置完工"
        :visible.sync="formFinishVisible"
        :close-on-click-modal="false"
        @close="closeDialog('finish')"
        custom-class="brand-dialog-min-width"
        width="32%"
        :modal-append-to-body="false"
      >
        <el-form
          :model="formDataFinish"
          label-width="80px"
          :rules="formRulesFinish"
          ref="formDataFinish"
        >
          <el-form-item label="完工日期" prop="operateDate">
            <el-date-picker
              type="date"
              placeholder="请选择项目实际完工的日期"
              v-model="formDataFinish.operateDate"
              value-format="yyyy-MM-dd"
              :picker-options="pickerOptions"
            ></el-date-picker>
          </el-form-item>
          <el-form-item label="完工原因" prop="operateReason">
            <el-input
              type="textarea"
              v-model="formDataFinish.operateReason"
              autocomplete="off"
              placeholder="请输入完工原因"
              maxlength="200"
              show-word-limit
            ></el-input>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click.native="cancelEdit('finish')" class="cancel"
            >取消</el-button
          >
          <el-button
            type="primary"
            @click.native="updateProjectState('finish', 'formDataFinish')"
            class="save"
            >保存</el-button
          >
        </div>
      </el-dialog>
    </div>
    <!-- 详情弹框 -->
    <projectDetailPage
      v-if="projectDetailShow"
      @closeDia="getCloseDia"
      :projectId="projectId"
    ></projectDetailPage>
    <!-- 待完善弹窗 -->
    <projectInfoDialog
      v-if="projectInfoVisible"
      @closeDialog="enterIndex"
      :projectId="projectId"
    ></projectInfoDialog>
    <!-- 项目历时状态变更弹框 -->
    <projectHistoryChange
      v-if="historyChangeDia"
      @closeDialog="hiddenDialog"
      :projectId="projectId"
    ></projectHistoryChange>
    <!-- 小项目管理规则弹窗 -->
    <rule-dialog
      :projectInfo="miniProjectInfo"
      :showTaskProp="showRuleDialog"
      @handleClose="showRuleDialog = false"
    />
    <!-- 项目状态变更 -->
    <project-status
      v-if="projectStatusDia"
      @closeStatusDialog="statusHiddenDialog"
      :projectId="projectId"
      :detailStatus="topInfo.state"
      @successFunc="successFunc"
    ></project-status>
  </div>
</template>

<script>
import common from '../../kits/common'
import projectDetailPage from '@/components/monitorProjectManagement/projectDetailPage'
import Guide from './guideHome'
import projectInfoDialog from '@/components/monitorProjectManagement/projectInfoDialog'
//引入vue数字滚动插件vue-countTo
import countTo from 'vue-count-to'
//项目历史状态变更弹框
import projectHistoryChange from '@/components/publicCom/projectHistoryChange'
import ruleDialog from '@/components/smallProjectManage/ruleDialog'
import projectStatus from '@/components/monitorProjectManagement/projectStatus'

export default {
  name: 'projectHome',
  components: {
    projectDetailPage,
    Guide,
    projectInfoDialog,
    projectHistoryChange,
    ruleDialog,
    projectStatus,
  },
  data() {
    return {
      isMini: 0,
      miniProjectInfo: {},
      miniMsg: '',

      showRuleDialog: false,

      backPayList: [], //拖欠劳动报酬轮播列表
      firstProject: false,
      isEsUsers: false,
      projectInfoVisible: false, //是否有待完善
      dangerousProjects: [], //风险项目数据
      dangerousDataTotal: 0,
      formStopVisible: false, //设置停工弹框
      formOverVisible: false, //设置竣工弹框
      formAgainStartVisible: false, //恢复开工
      formDataStop: {
        operateDate: '',
        operateReason: '',
      },
      formRulesStop: {
        operateDate: [
          {
            required: true,
            message: '停工日期不能为空',
            trigger: 'change',
          },
        ],
        operateReason: [
          {
            required: true,
            message: '请输入停工原因',
            trigger: 'blur',
          },
        ],
      },
      formDataOver: {
        operateDate: '',
        operateReason: '',
      },
      formRulesOver: {
        operateDate: [
          {
            required: true,
            message: '竣工日期不能为空',
            trigger: 'change',
          },
        ],
        operateReason: [
          {
            required: true,
            message: '请输入竣工原因',
            trigger: 'blur',
          },
        ],
      },
      formDataAgainStart: {
        operateDate: '',
        operateReason: '',
      },
      formRulesAgainStart: {
        operateDate: [
          {
            required: true,
            message: '恢复日期不能为空',
            trigger: 'change',
          },
        ],
        operateReason: [
          {
            required: true,
            message: '请输入恢复原因',
            trigger: 'blur',
          },
        ],
      },
      formFinishVisible: false,
      formDataFinish: {
        operateDate: '',
        operateReason: '',
      },
      formRulesFinish: {
        operateDate: [
          {
            required: true,
            message: '完工日期不能为空',
            trigger: 'change',
          },
        ],
        operateReason: [
          {
            required: true,
            message: '请输入完工原因',
            trigger: 'blur',
          },
        ],
      },
      projectId: '', //列表id4201011
      companyType: '', //企业类型 JG建设方 SG施工方
      topInfo: {
        projectName: '',
        state: '',
        stateName: '',
        createTime: '', //建档日期
        date: '',
        period: '',
        endDay: '',
        hasUpload: '', //维权公示牌是否上传
        hasLiveSitUpload: '', //现场情况
      },
      publicSign: {
        imgUrl: '', //公示牌路径
        srcList: [], //
        xcImgUrl: '', //现场情况路径
        xcSrcList: [], //
      },
      uploadUrl: '',
      changeUploadUrl: '', //替换公示牌
      uploadData: {
        projectId: '', //公示牌传项目id
      },
      pickerOptions: this.processDate(),
      path: '',
      activeName: 'first',
      alertTotal: 0,
      checkTotal: 0,
      alertData: [],
      checkData: [],
      gradeLevel: '', //评级
      projectScoreId: '',
      hasSalaryAccount: false,
      accountInfo: '', //专户分拨账户
      employeeInfo: '', //实名制
      salaryInfo: '', //工资代发信息
      salaryDay: '',
      noRealName: true, //判断没有实名制
      noSalary: true, //表示没有工资
      policyData: [], //政策要点数据
      policyTotal: 0,
      bzjInfo: '', //保证金
      hasInsurance: false,
      insuranceTotal: 0,
      insuranceInfo: {},
      isShowUpdate: '',
      projectList: [], //项目名称列表
      projectDetailShow: false, //详情弹框是否显示
      qrcodeBoxUrl: '', //二维码图片
      qrcodeImgCon: false, //二维码整体
      qrcode: true,
      isShowDetail: '',
      isShowScore: false,
      isShowDanger: false,
      seeExample: {
        imgUrl: '', //公示牌路径
        srcList: [], //
      },
      isShowSeeExample: false,
      historyChangeDia: false, //项目历时状态弹框
      myChart: '',
      loadingAll: false,
      tableData: [],
      isShow: false,
      attTotalRate: '',
      attTodayTotal: '',
      empOnJob: '',
      xcUploadData: {
        projectId: '',
      },
      //项目服务状态
      projectService: {
        state: 1,
        startDate: '2021-08-20',
        endDate: '2021-08-30',
      },
      overDate: 0,
      recordInfo: {},
      isShowStatuChange: false,
      projectStatusDia: false,
      isShowBut: false,
    }
  },
  activated() {
    // 解决其他页面浏览器放大缩小，切换到本页面echarts不显示的问题
    if (this.myChart) {
      this.myChart.resize()
    }
  },
  async created() {
    //获取项目列表
    await this.getProjectList()
    this.projectId = this.$store.state.projectId

    this.getMiniInfo(this.projectId)

    // 恩施工商保险信息
    await this.getRecordInfo()
    await this.getImproveProject()
    // 判断是否显示项目状态变更按钮
    this.getOauthJudge()
    if (window.localStorage.getItem('firstProject')) {
      let arr = JSON.parse(window.localStorage.getItem('firstProject'))
      let nickname = this.$store.state.nickName
      let flag = false
      arr.forEach((element) => {
        if (element.nickname == nickname) {
          flag = true
        }
      })
      if (!flag) {
        this.firstProject = true
      }
    } else {
      this.firstProject = true
    }
    this.getAttData()
    //获取风险项目数据
    // this.getDangerData();
    //获取政策要点数据
    this.getPlicyData()
    // 上传图片路径
    this.uploadUrl = common.commonApi + 'api-f/files/upload'
    this.isShowUpdate =
      this.$store.state.buttonLimitsArr.indexOf('mProjectList:update') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('accountList:update') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectList:update') > -1
    this.isShowDetail =
      this.$store.state.buttonLimitsArr.indexOf('mProjectList:detail') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('accountList:detail') > -1 ||
      this.$store.state.buttonLimitsArr.indexOf('projectList:detail') > -1
    this.isEsUsers = this.isEsUser()
    if (this.isEsUser()) {
      this.isShowScore = false
      this.isShowDanger = false
    } else {
      this.isShowScore = false
      this.isShowDanger = false
    }
    // 考勤列表
    this.getAttList()
  },
  mounted() {
    // await this.getBackPayList()
    //政策要点滚动显示
    $('#niceScroll').niceScroll({
      cursorwidth: '10px',
      cursoropacitymax: 0.5,
    })
    this.clickDocument()
  },
  methods: {
    //判断是否为小项目
    getMiniInfo(projectId) {
      this.axios
        .post('api-p/project/expand/findMiniProConfig', { projectId })
        .then((res) => {
          if (!res.data.hasError) {
            this.miniProjectInfo = res.data.result ? res.data.result : {}
            this.miniMsg = res.data.msg ? res.data.msg : ''
            this.isMini = 1
          } else {
            this.isMini = 0
            // this.miniMsg = res.data.errorMsg
          }
        })
    },
    lookRule() {
      if (this.miniMsg) {
        this.$message.warning(this.miniMsg)
      } else {
        this.showRuleDialog = true
      }
    },
    // 恩施工伤保险信息获取备案信息
    getRecordInfo() {
      return this.axios({
        method: 'post',
        url: '/api-e/cs/emprecord/expand/statistics',
        data: {
          projectId: this.projectId,
        },
      })
        .then((response) => {
          this.recordInfo = response.data.result
        })
        .catch((error) => {})
    },
    /**
     * @description: 开始轮播
     * @param {*}
     * @return {*}
     */
    beginRotation() {
      this.$nextTick((v) => {
        if (this.$refs.subBox) {
          const width = this.$refs.subBox.offsetWidth
          const time = Math.ceil(width / 80)
          const keyframesLine = `
              @keyframes line{
                  0%{
                    transform: translateX(0);
                  }
                  ${120 / time}%{
                      transform: translateX(0);
                  }
                  100%{
                    transform: translateX(-100%);
                  }
              }
            `
          var style = document.styleSheets[0]
          style.insertRule(keyframesLine, style.length - 1)
          this.$refs.subBox.style.animation = `line ${time}s linear infinite`
        }
      })
    },
    /**
     * @description: 拖欠劳动报酬项目列表
     * @param {*}
     * @return {*}
     */
    getBackPayList() {
      return this.axios({
        method: 'post',
        url: 'api-r/rightsdispute/expand/disputeRotation',
        data: {
          projectId: this.projectId,
        },
      })
        .then((response) => {
          if (!response.data.hasError) {
            this.backPayList = response.data.result
          } else {
            this.$message.error(response.data.errorMsg)
          }
        })
        .catch((error) => {
          if (error.response) {
            this.$message.error(error.response.data)
          }
        })
    },
    /**
     * @description: 跳转违法记载
     * @param {*}
     * @return {*}
     */
    jumpIllegalRecord() {
      this.$router.push({
        path: '/home/illegal/illegalRecord',
        name: 'illegalRecord',
        query: {
          preciseTypeId: '17',
        },
      })
      this.$store.commit('CHANGE_SLIDER_NAME', {
        oldUrl: '/home/illegal/illegalRecord',
        newUrl: this.$router.currentRoute.fullPath,
      })
    },
    getLastTime() {
      let currrentDate = parseInt(new Date().getTime() / 1000)
      let projectService = this.projectService
      let endDates = parseInt(
        new Date(projectService.endDate + ' 23:59:59').getTime() / 1000
      )
      let cutTime = endDates - currrentDate
      let hours = parseInt(cutTime / 3600)
      let lastHours = hours % 24
      return (hours - lastHours) / 24 + '天' + lastHours + '小时'
    },
    //获得项目状态信息
    getProjectStatus(params) {
      this.axios
        .post('api-p/projectserve/base/getProjectAccountInfo', params)
        .then((res) => {
          if (!res.data.hasError) {
            if (res.data.result) {
              this.overDate = res.data.result.switchState
            } else {
              this.overDate = 0
            }
            this.projectService = res.data.result
          }
        })
    },
    //已经阅读过项目看板指导页面
    setRead() {
      this.firstProject = false
      if (window.localStorage.getItem('firstProject')) {
        let arr = JSON.parse(window.localStorage.getItem('firstProject'))
        let nickname = this.$store.state.nickName
        let flag = false
        arr.forEach((element) => {
          if (element.nickname == nickname) {
            flag = true
          }
        })
        if (!flag) {
          arr.push({ read: true, nickname: this.$store.state.nickName })
          window.localStorage.setItem('firstProject', JSON.stringify(arr))
        }
      } else {
        window.localStorage.setItem(
          'firstProject',
          JSON.stringify([{ read: true, nickname: this.$store.state.nickName }])
        )
      }
    },
    enterIndex() {
      this.projectInfoVisible = false
    },
    //是否有待完善项目
    getImproveProject() {
      return this.axios({
        method: 'post',
        url: '/api-p/project/base/findprojectbyuser',
      })
        .then((response) => {
          if (!response.data.hasError) {
            this.projectInfoVisible = response.data.result ? true : false
            // this.projectInfoVisible=true
          }
        })
        .catch((error) => {
          this.$message.error('数据获取失败')
        })
    },
    // 移入
    mouseOver() {
      this.qrcodeImgCon = true
      this.qrcode = false
    },
    //移出
    mouseleave() {
      this.qrcodeImgCon = false
      this.qrcode = true
    },
    clickDocument() {
      $(document).click(() => {
        this.qrcodeImgCon = false
        this.qrcode = true
      })
    },
    downLoad() {
      window.open(
        common.commonApi + 'api-p/project/base/downqr?info=' + this.projectId
      )
    },
    //获取项目列表
    getProjectList() {
      return this.axios({
        method: 'post',
        url: '/api-u/userpro/current',
      })
        .then(
          async (response) => {
            if (!response.data.hasError) {
              var data = response.data.result
              this.$store.commit('SET_INFO', [
                'projectName',
                data.projects[0].projectName,
              ])
              this.projectId = data.checkId
                ? data.checkId
                : data.projects[0].projectId
              this.getProjectStatus({ projectId: this.projectId })
              this.$store.commit('SET_INFO', ['projectId', this.projectId])
              await this.getBackPayList()
              this.beginRotation()
              this.projectList = data.projects
              this.useFunction()
              this.isClearAccount(this.projectId)
            }
          },
          (res) => {
            this.$message.error('项目数据获取失败')
          }
        )
        .catch((error) => {
          //   this.$message.error("项目数据获取失败");
        })
    },
    changeProject(projectId, projectName) {
      this.infos = {}
      this.projectId = projectId
      this.projectName = projectName
      this.useFunction()
      //记录当前id，确保下次登录展示上一次浏览的看板首页
      this.recordCurrentProject(this.projectId)
      //项目切换判断该项目专户是否清除
      this.isClearAccount(this.projectId)
    },
    recordCurrentProject(projectId) {
      this.axios({
        method: 'post',
        url: '/api-u/userpro/changepro',
        data: {
          projectId: projectId,
        },
      })
        .then((res) => {})
        .catch((resp) => {})
    },
    useFunction() {
      this.$nextTick(function () {
        //公示牌参数
        this.uploadData.projectId = this.projectId
        this.xcUploadData.projectId = this.projectId

        //二维码路径
        this.qrcodeBoxUrl =
          common.commonApi + 'api-p/project/base/qrimage?info=' + this.projectId
        // 获取查看范例
        this.getSeeExample()
        //获取项目详情信息
        this.getProjectInfo(this.projectId)
        //获取风险项目数据
        this.getDangerData(this.projectId)
        //保证金信息
        this.getBzjInfo(this.projectId)
        //获取工伤保险信息
        this.getInsurranceInfo(this.projectId)
        //获取公示牌
        this.getPublicSign(this.projectId)
        //项目评级
        this.getLevel(this.projectId)
        //获取预警信息
        this.getAlertInfo(this.projectId)
        //获取待处理审核数据
        //页面影藏接口还在调用，接口500导致错误提示问题
        // this.getCheckInfo(this.projectId);
        //分账管理
        this.getAccount(this.projectId)
        //实名制
        this.getEmployee(this.projectId)
        //工资代发
        this.getSalary(this.projectId)
        // 获取现场情况
        this.getLiveSituation(this.projectId)
      })
    },
    //获取风险项目数据
    getDangerData(projectId) {
      this.axios({
        method: 'post',
        url: 'api-ps/creditProjScorDetail/expand/findProjectRiskByCompany',
        data: {
          projectId: projectId,
        },
      })
        .then((res) => {
          if (!res.data.hasError) {
            this.dangerousDataTotal = res.data.result.length
            this.dangerousProjects = res.data.result
          } else {
            this.$message.error('项目风险数据获取失败')
          }
        })
        .catch((resp) => {
          //
        })
    },
    //跳转至项目评价详情
    skipProjectDanger(projectId, routerUrl, projectScoreId) {
      if (this.accessControl(routerUrl) == -1) {
        this.goNoAccessPage()
      } else {
        this.$router.push({
          name: 'projectScoreDetail',
          path: '/home/enterpriseScore/projectScoreDetail',
          query: {
            projectId: projectId,
            projectScoreId,
          },
        })
        this.$store.commit('CHANGE_SLIDER_NAME', {
          oldUrl: '/home/enterpriseScore/projectScoreList',
          newUrl: this.$router.currentRoute.fullPath,
        })
      }
    },
    openDialog(getParams) {
      if (getParams == 'stop') {
        this.formStopVisible = true
      } else if (getParams == 'over') {
        this.formOverVisible = true
      } else if (getParams == 'againStart') {
        this.formAgainStartVisible = true
      } else if (getParams == 'finish') {
        this.formFinishVisible = true
      }
    },
    //关闭停工弹窗
    closeDialog(getParams) {
      if (getParams == 'stop') {
        this.$refs.formDataStop.resetFields()
      } else if (getParams == 'over') {
        this.$refs.formDataOver.resetFields()
      } else if (getParams == 'againStart') {
        this.$refs.formDataAgainStart.resetFields()
      } else if (getParams == 'finish') {
        this.$refs.formDataFinish.resetFields()
      }
    },
    //停工弹框取消
    cancelEdit(getParams) {
      if (getParams == 'stop') {
        this.formStopVisible = false
        this.$refs.formDataStop.resetFields()
      } else if (getParams == 'over') {
        this.formOverVisible = false
        this.$refs.formDataOver.resetFields()
      } else if (getParams == 'againStart') {
        this.formAgainStartVisible = false
        this.$refs.formDataAgainStart.resetFields()
      } else if (getParams == 'finish') {
        this.formFinishVisible = true
        this.$refs.formDataFinish.resetFields()
      }
    },
    //保存恢复开工、竣工、停工 参数（表单状态，表单名字）
    updateProjectState(status, formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          //传值后台
          var data = ''
          if (status === 'start') {
            //恢复开工
            data = {
              projectId: this.projectId,
              status: 'STARTED',
              date: this.formDataAgainStart.operateDate,
              reason: this.formDataAgainStart.operateReason,
            }
          }
          if (status === 'stop') {
            //设置停工
            data = {
              projectId: this.projectId,
              status: 'STOPPED',
              date: this.formDataStop.operateDate,
              reason: this.formDataStop.operateReason,
            }
          }
          if (status === 'over') {
            //恢复竣工
            data = {
              projectId: this.projectId,
              status: 'COMPLETED',
              date: this.formDataOver.operateDate,
              reason: this.formDataOver.operateReason,
            }
          }
          if (status === 'finish') {
            //设置完工
            data = {
              projectId: this.projectId,
              status: 'FINISHED',
              date: this.formDataFinish.operateDate,
              reason: this.formDataFinish.operateReason,
            }
          }
          this.updateStateAjax(status, data)
        } else {
          return false
        }
      })
    },
    //保存恢复开工、竣工、停工表单
    updateStateAjax(status, data) {
      this.axios({
        method: 'post',
        url: 'api-p/projectstatus/expand/changestatus',
        data: data,
      })
        .then(
          (res) => {
            if (!res.data.hasError) {
              this.$message({
                message: '设置成功',
                type: 'success',
              })
              this.$nextTick(function () {
                //关闭弹窗
                if (status === 'start') {
                  //恢复开工
                  //获取项目详情
                  this.getProjectInfo()
                  this.formAgainStartVisible = false
                  this.$refs.formDataAgainStart.resetFields()
                }
                if (status === 'stop') {
                  //设置停工
                  //获取项目详情
                  this.getProjectInfo()
                  this.formStopVisible = false
                  this.$refs.formDataStop.resetFields()
                }
                if (status === 'over') {
                  //恢复竣工
                  //获取项目详情
                  this.getProjectInfo()
                  this.formOverVisible = false
                  this.$refs.formDataOver.resetFields()
                }
                if (status === 'finish') {
                  //恢复竣工
                  //获取项目详情
                  this.getProjectInfo()
                  this.formFinishVisible = false
                  this.$refs.formDataFinish.resetFields()
                }
              })
            } else {
              this.$message({
                message: res.data.errorMsg,
                type: 'error',
              })
            }
          },
          (res) => {
            this.$message({
              message: res.data.errorMsg,
              type: 'error',
            })
          }
        )
        .catch((error) => {})
    },
    //上传公示牌失败
    uploadError() {
      this.$message({
        message: '上传失败',
        type: 'error',
      })
    },
    //上传公示牌成功将图片返给后台
    uploadSuccess(file) {
      //重新将图片信息传给后台
      this.axios({
        method: 'post',
        url: 'api-p/projectstats/expand/uploadpublic',
        data: {
          file: JSON.stringify(file),
          projectId: this.projectId,
        },
      })
        .then(
          (res) => {
            if (!res.data.hasError) {
              this.$message({
                message: '上传成功',
                type: 'success',
              })
              this.topInfo.hasUpload = '已上传'
              this.publicSign.imgUrl = file.url
              this.publicSign.srcList = []
              this.publicSign.srcList.push(file.url)
            } else {
              this.$message({
                message: res.data.errorMsg,
                type: 'error',
              })
            }
          },
          (res) => {
            this.$message({
              message: res.data.errorMsg,
              type: 'error',
            })
          }
        )
        .catch((error) => {})
    },
    //替换成功将图片返给后台
    changeUploadSuccess(file) {
      //重新将图片信息传给后台
      this.axios({
        method: 'post',
        url: 'api-p/projectstats/expand/reuploadpublic',
        data: {
          file: JSON.stringify(file),
          projectId: this.projectId,
        },
      })
        .then(
          (res) => {
            if (!res.data.hasError) {
              this.$message({
                message: '上传成功',
                type: 'success',
              })
              this.publicSign.imgUrl = file.url
              this.publicSign.srcList = []
              this.publicSign.srcList.push(file.url)
            } else {
              this.$message({
                message: '替换失败',
                type: 'success',
              })
            }
          },
          (res) => {
            this.$message({
              message: res.data.errorMsg,
              type: 'error',
            })
          }
        )
        .catch((error) => {})
    },
    //获取项目详情
    getProjectInfo(projectId) {
      this.axios({
        method: 'post',
        url: 'api-p/project/expand/projectdetail',
        data: {
          projectId: projectId,
        },
      })
        .then(
          (res) => {
            var data = res.data.result
            this.topInfo.projectName = data.projectName
            this.topInfo.state = data.status
            this.topInfo.stateName = data.statusDesc
            this.topInfo.createTime = data.createTime
            this.topInfo.date = data.startDate
            this.topInfo.period = data.cycle
            this.topInfo.endDay = data.disDate
            this.salaryDay = data.salaryDay
            this.$store.commit('SET_INFO', ['projectAreaId', data.areaId])
          },
          (res) => {
            this.$message({
              message: '加载详情失败',
              type: 'error',
            })
          }
        )
        .catch((error) => {
          //
        })
    },
    //打开弹框
    seeProjectDetail() {
      this.projectDetailShow = true
    },
    //关闭弹框
    getCloseDia(val) {
      this.projectDetailShow = val
    },
    //获取公示牌
    getPublicSign(projectId) {
      this.axios({
        method: 'post',
        url: 'api-p/projectstats/expand/showpublic',
        data: {
          projectId: projectId,
        },
      })
        .then(
          (res) => {
            if (!res.data.hasError) {
              //如果为true，则未上传公示牌
              this.topInfo.hasUpload = '已上传'
              var data = res.data.result
              this.publicSign.imgUrl = data.absolutePath
              this.publicSign.srcList.push(data.absolutePath)
            } else {
              this.topInfo.hasUpload = '未上传'
            }
          },
          (res) => {
            this.$message({
              message: '加载公示牌失败',
              type: 'error',
            })
          }
        )
        .catch((error) => {})
    },
    //添加人员
    addEmployee(routerUrl) {
      if (this.accessControl(routerUrl) == -1) {
        this.goNoAccessPage()
      } else {
        this.$router.push({
          name: 'projectEmployeeQY',
          path: '/home/employee/projectEmployeeQY',
          query: {
            projectId: this.projectId,
            projectName: this.topInfo.projectName,
          },
        })
        this.$store.commit('CHANGE_SLIDER_NAME', {
          oldUrl: '/home/employee/projectEmployeeQY',
          newUrl: this.$router.currentRoute.fullPath,
        })
      }
    },
    // 弹框竣工，停工中日期限制
    processDate() {
      var that = this
      return {
        disabledDate(time) {
          var hiringTime = that.topInfo.date.toString()
          // 解决在ie中的兼容问题 需要转成/
          hiringTime = hiringTime.replace(/\./g, '/')
          if (hiringTime) {
            return time.getTime() < new Date(hiringTime).getTime()
          }
        },
      }
    },
    //限制公示牌大小
    limitSize(file) {
      let types = file.type.split('/')
      if (!['png', 'jpg', 'jpeg', 'PNG', 'JPG', 'JPEG'].includes(types[1])) {
        this.$message({
          message: `请选择png，jpg，jpeg的图片`,
          type: 'warning',
        })
        return false
      }

      if (file.size > 5 * 1024 * 1024) {
        this.$message.error('请上传5M以内的图片')
        return false
      }
    },

    //制作工资表
    makeSalary(routerUrl) {
      if (this.accessControl(routerUrl) == -1) {
        this.goNoAccessPage()
      } else {
        this.$router.push({
          name: 'companySalaryBatchList',
          path: '/home/salaryDf/companySalaryBatchList',
          query: {
            projectId: this.projectId,
            projectName: this.topInfo.projectName,
          },
        })
        this.$store.commit('CHANGE_SLIDER_NAME', {
          oldUrl: '/home/salaryDf/companySalaryBatchList',
          newUrl: this.$router.currentRoute.fullPath,
        })
      }
    },
    func(cname) {
      var cname = document.getElementsByClassName(cname)
      for (var i = 0; i < cname.length; i++) {
        var nowLength = cname[i].innerHTML.length
        if (nowLength > 40) {
          cname[i].innerHTML = cname[i].innerHTML.substr(0, 40) + '...'
        }
      }
    },
    //获取政策要点数据
    getPlicyData() {
      this.axios({
        method: 'post',
        url: 'api-i/info/expand/listbypage',
        data: {
          // pageNo: 1,
          // pageSize: 10,
          status: '02',
          type: '05',
          reveiveUserType: 'PROJECT',
        },
      })
        .then(
          (res) => {
            if (!res.data.hasError) {
              this.policyTotal = res.data.result.totalCount
              this.policyData = res.data.result.results
            } else {
              this.$message.error('政策要点数据获取失败')
            }
          },
          (res) => {
            this.$message.error('政策要点数据获取失败')
          }
        )
        .catch((error) => {
          //
        })
    },
    //跳转政策要点详情
    skipPolicy(id, title, type, range, routerUrl) {
      if (this.accessControl(routerUrl) == -1) {
        this.goNoAccessPage()
      } else {
        this.$router.push({
          name: 'inforDetail',
          path: '/home/notice/inforDetail',
          query: {
            status: '02',
            id: id,
            title: title,
            type: type,
            range: range,
            pathUrl: '/home',
          },
        })
        this.$store.commit('CHANGE_SLIDER_NAME', {
          oldUrl: '/home/notice/inforList',
          newUrl: this.$router.currentRoute.fullPath,
        })
      }
    },
    getBzjInfo(projectId) {
      this.axios({
        method: 'post',
        url: 'api-d/deposit/expand/projectdepositdetail',
        data: {
          projectId: projectId,
        },
      })
        .then((response) => {
          if (!response.data.hasError) {
            this.bzjInfo = response.data.result
          }
        })
        .catch((error) => {
          // this.$message.error("专户数据获取失败");
        })
    },
    //获取工伤保险数据
    getInsurranceInfo(projectId) {
      this.axios({
        method: 'post',
        url: 'api-e/cs/ins/expand/inslist',
        data: {
          projectId: projectId,
        },
      })
        .then(
          (res) => {
            if (!res.data.hasError) {
              this.insuranceTotal = res.data.result.length
              if (res.data.result.length > 0) {
                this.hasInsurance = true
                this.insuranceInfo = res.data.result[0]
              } else {
                this.hasInsurance = false
              }
            } else {
              this.$message.error('工伤保险数据获取失败')
            }
          },
          (res) => {
            this.$message.error('工伤保险数据获取失败')
          }
        )
        .catch((error) => {
          //   console.log("工伤保险数据获取失败");
        })
    },
    skipAddInsurrance() {
      if (this.isEsUser()) {
        this.$router.push({
          name: 'EsInsurance',
          path: '/home/EsInsurance/EsInsurance',
        })
      } else {
        this.$router.push({
          name: 'insurance',
          path: '/home/insurance/insurance',
          query: {
            projectId: this.projectId,
            projectName: this.topInfo.projectName,
          },
        })
        this.$store.commit('CHANGE_SLIDER_NAME', {
          oldUrl: '/home/insurance/insurance',
          newUrl: this.$router.currentRoute.fullPath,
        })
      }
      this.getAreaInfo()
    },
    //跳转工伤保险
    skipInsurrance(routerUrl) {
      if (this.accessControl(routerUrl) == -1) {
        this.goNoAccessPage()
      } else {
        this.$router.push({
          // name: "insurance",
          path: routerUrl,
          query: {
            projectId: this.projectId,
            projectName: this.topInfo.projectName,
          },
        })
        this.$store.commit('CHANGE_SLIDER_NAME', {
          oldUrl: routerUrl,
          newUrl: this.$router.currentRoute.fullPath,
        })
      }
    },
    numberFormat(value) {
      var param = {}
      var k = 10000,
        sizes = ['', '万', '亿'],
        len = sizes.length,
        i
      if (value < k) {
        param.value = value
        param.unit = ''
      } else {
        i = Math.floor(Math.log(value) / Math.log(k))
        i = i > len - 1 ? len - 1 : i
        param.value = (value / Math.pow(k, i)).toFixed(2)
        param.unit = sizes[i]
      }
      return param.value + param.unit
    },
    getLevel(projectId) {
      this.axios({
        method: 'post',
        url: 'api-ps/creditProjectScore/expand/projectScoreByLatest',
        data: {
          projectId: projectId,
        },
      })
        .then((res) => {
          if (res.data.result.length != 0) {
            this.gradeLevel = res.data.result[0].gradeLevel
            this.projectScoreId = res.data.result[0].id
          } else {
            this.gradeLevel = ''
            this.id = ''
          }
        })
        .catch((error) => {})
    },
    xfCredit(routerUrl) {
      if (this.accessControl(routerUrl) == -1) {
        this.goNoAccessPage()
      } else {
        this.$router.push({
          name: 'projectScoreDetail',
          path: '/home/enterpriseScore/projectScoreDetail',
          query: {
            projectId: this.projectId,
            projectScoreId: this.projectScoreId,
          },
        })
        this.$store.commit('CHANGE_SLIDER_NAME', {
          oldUrl: '/home/enterpriseScore/projectScoreList',
          newUrl: this.$router.currentRoute.fullPath,
        })
      }
    },
    //获取预警数据
    getAlertInfo(projectId) {
      this.axios({
        method: 'post',
        url: 'api-a/cs/alert/expand/projectalert',
        data: {
          projectId: projectId,
          pageSize: 4,
          pageNo: 1,
          status: '["01"]', //未处理
        },
      })
        .then(
          (res) => {
            if (!res.data.hasError) {
              this.alertTotal = res.data.result.total
              this.alertData = res.data.result.results
            } else {
              this.$message.error('预警数据获取失败')
            }
          },
          (res) => {
            this.$message.error('预警数据获取失败')
          }
        )
        .catch((error) => {
          this.$message.error('预警数据获取失败')
        })
    },
    //跳转预警
    skipAlert(routerUrl) {
      if (this.accessControl(routerUrl) == -1) {
        this.goNoAccessPage()
      } else {
        this.$router.push({
          name: 'constructAlertProjectList',
          path: '/home/project/constructAlertProjectList',
          query: {
            projectId: this.projectId,
            projectName: this.topInfo.projectName,
            status: '01',
          },
        })
        this.$store.commit('CHANGE_SLIDER_NAME', {
          oldUrl: '/home/project/constructAlertProjectList',
          newUrl: this.$router.currentRoute.fullPath,
        })
      }
    },
    //去处理预警详情
    seeAlertDetail(id, routerUrl) {
      if (this.accessControl(routerUrl) == -1) {
        this.goNoAccessPage()
      } else {
        this.$router.push({
          name: 'constructAlertDetail',
          path: '/home/project/constructAlertDetail',
          query: {
            alertId: id,
          },
        })
        this.$store.commit('CHANGE_SLIDER_NAME', {
          oldUrl: '/home/project/constructAlertProjectList',
          newUrl: this.$router.currentRoute.fullPath,
        })
      }
    },
    //获取待审核数据
    getCheckInfo(projectId) {
      this.axios({
        method: 'post',
        url: 'api-e/cs/application/expend/listbypage',
        data: {
          projectId: projectId,
          pageSize: 4,
          pageNo: 1,
          status: 'AUDIT', //未处理
        },
      })
        .then(
          (res) => {
            if (!res.data.hasError) {
              this.checkTotal = res.data.result.total
              this.checkData = res.data.result.results
            } else {
              this.$message.error('待审核数据获取失败')
            }
          },
          (res) => {
            this.$message.error('待审核数据获取失败')
          }
        )
        .catch((error) => {
          this.$message.error('待审核数据获取失败')
        })
    },
    //跳转人员申请
    skipApplyEmployee(routerUrl) {
      if (this.accessControl(routerUrl) == -1) {
        this.goNoAccessPage()
      } else {
        this.$router.push({
          name: 'projectEmployeeApply',
          path: '/home/employee/projectEmployeeApply',
          query: {
            projectId: this.projectId,
            status: 'AUDIT',
          },
        })
        this.$store.commit('CHANGE_SLIDER_NAME', {
          oldUrl: '/home/employee/projectEmployeeApply',
          newUrl: this.$router.currentRoute.fullPath,
        })
      }
    },
    getAccount(projectId) {
      this.axios({
        method: 'post',
        url: 'api-acc/account/expand/findaccountbyprojectid',
        data: {
          projectId: projectId,
        },
      })
        .then((res) => {
          if (!res.data.hasError) {
            var data = res.data.result
            this.hasSalaryAccount = data.hasSalaryAccount
            if (this.hasSalaryAccount == true) {
              this.accountInfo = res.data.result
            }
          }
        })
        .catch((error) => {})
    },
    getEmployee(projectId) {
      this.axios({
        method: 'post',
        url: 'api-p/projectstats/expand/projectrealnamestatistics',
        data: {
          projectId: projectId,
        },
      })
        .then((response) => {
          if (!response.data.hasError) {
            this.employeeInfo = response.data.result
            this.noRealName = response.data.result.noRealName
          }
        })
        .catch((response) => {})
    },
    getSalary(projectId) {
      this.axios({
        method: 'post',
        url: 'api-su/cs/salarystats/expand/salarydistribution',
        data: {
          projectId: projectId,
        },
      })
        .then((response) => {
          if (!response.data.hasError) {
            this.salaryInfo = response.data.result
            this.noSalary = response.data.result.noSalary
          }
        })
        .catch((response) => {})
    },
    //添加专户
    addAccountInfo(routerUrl) {
      if (this.accessControl(routerUrl) == -1) {
        this.goNoAccessPage()
      } else {
        this.$router.push({
          name: 'specialAccountList',
          path: '/home/specialAccount/specialAccountList',
          query: {
            projectId: this.projectId,
            projectName: this.projectName,
          },
        })
        this.$store.commit('CHANGE_SLIDER_NAME', {
          oldUrl: '/home/specialAccount/specialAccountList',
          newUrl: this.$router.currentRoute.fullPath,
        })
      }
    },
    showPic(type) {
      $('#' + type).click()
    },
    updateProjectInfo() {
      this.$router.push({
        path: '/home/monitorProjectManagement/projectInfoUpd',
        name: 'projectInfoUpd',
        query: {
          projectId: this.projectId,
          paramsType: 'projectHome', //项目端首页标识
        },
      })
      this.$store.commit('CHANGE_SLIDER_NAME', {
        oldUrl: '/home/indexHome/projectHome',
        newUrl: this.$router.currentRoute.fullPath,
      })
    },
    isClearAccount(projectId) {
      this.axios({
        method: 'post',
        url: 'api-acc/companyaccount/expand/isUpdate',
        data: {
          projectId: projectId,
        },
      }).then((response) => {
        //专户被清除为true，专户没被清除为false
        if (response.data.hasError) {
          this.showTip()
        } else {
        }
      })
    },
    showTip(oldGroup, typeName) {
      this.$confirm(
        '您的项目施工方已被修改，原有施工方的统一专户无法使用，请重新录入工资专户',
        {
          confirmButtonText: '去添加',
          type: 'warning',
          center: true,
          showClose: false,
          showCancelButton: false,
        }
      )
        .then((action) => {
          //去添加则跳转至分账管理-专户列表页面；
          this.$router.push({
            path: '/home/specialAccount/specialAccountList',
            name: 'specialAccountList',
          })
          this.$store.commit('CHANGE_SLIDER_NAME', {
            oldUrl: '/home/specialAccount/specialAccountList',
            newUrl: this.$router.currentRoute.fullPath,
          })
        })
        .catch(() => {})
    },
    getSeeExample() {
      this.axios({
        method: 'post',
        url: '/api-f/template/download',
        data: {
          typeId: '01',
          projectId: this.projectId,
        },
      }).then((response) => {
        if (!response.data.hasError) {
          this.isShowSeeExample = true
          this.seeExample.imgUrl = response.data.result.templatePath
          this.seeExample.srcList = []
          this.seeExample.srcList.push(response.data.result.templatePath)
          // this.getName(this.seeExample.imgUrl)
        } else {
          this.isShowSeeExample = false
          // this.$message({
          // message: response.data.errorMsg,
          // type: "error"
          // });
        }
      })
    },
    lookResult(url) {
      window.open(url)
    },
    getName(url) {
      if (url) {
        const fileName = url.lastIndexOf('/') // 取到文件名开始到最后一个点的长度
        const fileNameLen = url.length // 取到文件名长度
        const fileType = url.substring(fileName + 1, fileNameLen) // 截
        return fileType
      }
    },
    checkImg(item) {
      var str = this.getName(item)
      if (str) {
        let arr = str.split('.')
        let name = arr[arr.length - 1]
        if (['png', 'PNG', 'jpg', 'JPG', 'jpeg', 'JPEG'].includes(name)) {
          return true
        }
        return false
      }
    },
    toHistoryChange() {
      this.historyChangeDia = true
    },
    //关闭历时动态弹框
    hiddenDialog() {
      this.historyChangeDia = false
    },
    // 获取考勤概况数据
    getAttData() {
      this.axios({
        method: 'post',
        url: '/api-att/cs/att/expand/atttodaytotal',
        data: { projectId: this.projectId },
      })
        .then((response) => {
          var data = response.data.result
          this.attTotalRate = data.attTotalRate
          this.attTodayTotal = data.attTodayTotal
          this.empOnJob = data.empOnJob
          this.getTodayAttPicData()
        })
        .catch((error) => {
          this.$message({
            showClose: true,
            duration: 3000,
            message: '获取数据失败',
            type: 'error',
          })
        })
    },
    // 获取考勤图例数据
    getTodayAttPicData() {
      var fontNum = document.body.clientWidth / 80,
        fontText = document.body.clientWidth / 130
      var todayAtt = this.$refs.todayAtt
      var picData
      if (this.empOnJob == '0' || this.empOnJob == 0) {
        picData = [
          {
            value: this.empOnJob,
            name: '无数据',
            itemStyle: { color: '#ccc' },
          },
        ]
      } else {
        picData = [
          {
            value: this.attTodayTotal,
            name: '今日出勤人数',
            itemStyle: { color: '#098F84' },
          },
          {
            value: this.empOnJob - this.attTodayTotal,
            name: '今日未出勤人数',
            itemStyle: { color: '#DB2121' },
          },
        ]
      }
      if (todayAtt) {
        this.myChart = this.$echarts.init(todayAtt)
        this.myChart.setOption({
          tooltip: {
            trigger: 'item',
            formatter: '{b}:{c}人',
          },
          series: [
            {
              name: '今日考勤概况',
              type: 'pie',
              radius: ['55%', '70%'],
              center: ['50%', '50%'], //图的位置，距离左跟上的位置
              avoidLabelOverlap: false,
              label: {
                normal: {
                  show: false,
                  position: 'center',
                },
              },
              labelLine: {
                normal: {
                  show: false,
                },
              },
              data: picData,
            },
          ],
          graphic: [
            {
              type: 'text',
              left: 'center',
              top: '40%',
              z: 10,
              zlevel: 10,
              style: {
                text: this.empOnJob + '人',
                fill: '#424242',
                textAlign: 'center',
                // font: "small-caps 24px/1 sans-serif"
                fontSize: fontNum,
              },
            },
            {
              type: 'text',
              left: 'center',
              top: '55%',
              z: 10,
              zlevel: 10,
              style: {
                text: '项目在职人数',
                fill: '#666',
                textAlign: 'center',
                // font: "small-caps 14px/1 sans-serif",
                fontSize: fontText,
              },
            },
          ],
        })
        window.addEventListener('resize', () => {
          this.myChart.resize()
        })
      }
    },
    getAttList() {
      const vm = this
      vm.axios({
        method: 'post',
        url: '/api-att/cs/att/expand/atttodaytotallist',
        data: { projectId: this.projectId },
      })
        .then((response) => {
          vm.tableData = response.data.result
          vm.loadingAll = false
          if (vm.tableData.length < 1) {
            vm.isShow = true
          }
        })
        .catch((error) => {
          vm.$message({
            showClose: true,
            duration: 3000,
            message: '获取数据失败',
            type: 'error',
          })
        })
    },
    load(tree, treeNode, resolve) {
      this.axios({
        method: 'post',
        url: '/api-att/cs/att/expand/atttodaytotaldetail',
        data: {
          projectId: this.projectId,
          projectCompanyId: tree.projectCompanyId,
        },
      }).then((res) => {
        let tableArray = res.data.result
        tableArray.forEach((item, index) => {
          delete item.areaName
        })
        resolve(res.data.result)
        if (res.data.result.length == 0) {
          this.$message({
            type: 'error',
            message: '本节点以下暂无子节点!',
          })
        }
      })
    },
    //获取现场情况 ---- start
    getLiveSituation(projectId) {
      this.axios({
        method: 'post',
        url: 'api-p/projectstats/expand/showPSS',
        data: {
          projectId: projectId,
        },
      })
        .then(
          (res) => {
            if (!res.data.hasError) {
              this.topInfo.hasLiveSitUpload = '已上传'
              var data = res.data.result
              this.publicSign.xcImgUrl = data.absolutePath
              this.publicSign.xcSrcList.push(data.absolutePath)
            } else {
              this.topInfo.hasLiveSitUpload = '未上传'
            }
          },
          (res) => {
            this.$message({
              message: '加载项目现场情况失败',
              type: 'error',
            })
          }
        )
        .catch((error) => {})
    },
    xcUploadSuccess(file) {
      this.axios({
        method: 'post',
        url: 'api-p/projectstats/expand/uploadPSS',
        data: {
          file: JSON.stringify(file),
          projectId: this.projectId,
        },
      })
        .then(
          (res) => {
            if (!res.data.hasError) {
              this.$message({
                message: '上传成功',
                type: 'success',
              })
              this.topInfo.hasLiveSitUpload = '已上传'
              this.publicSign.xcImgUrl = file.url
              this.publicSign.xcSrcList = []
              this.publicSign.xcSrcList.push(file.url)
            } else {
              this.$message({
                message: res.data.errorMsg,
                type: 'error',
              })
            }
          },
          (res) => {
            this.$message({
              message: res.data.errorMsg,
              type: 'error',
            })
          }
        )
        .catch((error) => {})
    },
    //替换成功将图片返给后台
    xcChangeUploadSuccess(file) {
      //重新将图片信息传给后台
      this.axios({
        method: 'post',
        url: 'api-p/projectstats/expand/reUploadPSS',
        data: {
          file: JSON.stringify(file),
          projectId: this.projectId,
        },
      })
        .then(
          (res) => {
            if (!res.data.hasError) {
              this.$message({
                message: '上传成功',
                type: 'success',
              })
              this.publicSign.xcImgUrl = file.url
              this.publicSign.xcSrcList = []
              this.publicSign.xcSrcList.push(file.url)
            } else {
              this.$message({
                message: '替换失败',
                type: 'success',
              })
            }
          },
          (res) => {
            this.$message({
              message: res.data.errorMsg,
              type: 'error',
            })
          }
        )
        .catch((error) => {})
    },
    //获取现场情况 ---- end
    // 查看拨付详情
    toDetail(id) {
      this.$router.push({
        path: '/home/separateAccountManagement/allocationPlanDetail',
        name: 'allocationPlanDetail',
        query: {
          disbursePlanId: id,
          type: 'detail',
        },
      })
      this.$store.commit('CHANGE_SLIDER_NAME', {
        oldUrl: '/home/specialAccount/specialAccountList',
        newUrl: this.$router.currentRoute.fullPath,
      })
    },
    toRegister() {
      this.$router.push({
        path: '/home/newInsurance/insuranceOrderGuide',
        name: 'insuranceOrderGuide',
        query: {},
      })
      this.$store.commit('CHANGE_SLIDER_NAME', {
        oldUrl: '/home/newInsurance/insuranceOrderGuide',
        newUrl: this.$router.currentRoute.fullPath,
      })
    },
    getOauthJudge() {
      this.axios({
        method: 'post',
        url: 'api-p/cs/projectstatusauditconfig/oauthJudge',
      })
        .then(
          (res) => {
            if (!res.data.hasError) {
              // true代表有权限
              this.isShowStatuChange = res.data.result
            }
          },
          (res) => {
            this.$message({
              message: '获取数据失败',
              type: 'error',
            })
          }
        )
        .catch((error) => {})
    },
    // 项目状态变更弹框
    statusChange() {
      this.projectStatusDia = true
    },
    statusHiddenDialog() {
      this.projectStatusDia = false
    },
    successFunc(val) {
      if (val) {
        this.topInfo.state = val
      }
      this.projectStatusDia = false
    },
  },
}
</script>

<style scoped lang="less">
.upload-demo {
  margin: 0 8px;
}
.homeContainer {
  background-color: #f5f7fa;
}
.redColor {
  color: #e02020;
}
.greenBack {
  background-color: #009588;
}
.greyBack {
  background-color: #647382;
}
.redBack {
  background-color: #db534b;
}
.yellowBack {
  background-color: #ffc200;
}
.font16 {
  font-size: 16px;
}
.titleBox {
  border: none;
}
.seeDetail,
.updateInfo {
  vertical-align: inherit;
}
.seeDetail {
  margin: 0 10px;
}
.modularTitle {
  font-size: 18px;
  line-height: 18px;
  color: #333;
}
.inline-block {
  display: inline-block;
}
.lineH67 {
  line-height: 67px;
}
.topBox {
  .projectState {
    display: inline-block;
    padding: 0 6px;
    height: 20px;
    line-height: 20px;
    font-size: 12px;
    color: #fff;
    text-align: center;
    margin-left: 10px;
    font-weight: normal;
    margin-top: 5px;
  }
  /deep/.el-input__inner {
    width: 346px;
    font: bold 20px Microsoft YaHei;
    color: #333333;
    border: none;
    height: 30px;
    // background: #e4ebf1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  /deep/.el-select__caret {
    color: #333;
    font-size: 20px;
    line-height: 30px;
  }
}
.waitAlertBox {
  height: 280px;
  margin-top: 10px;
  padding: 10px 15px;
  background: #fff;
  .titleWord {
    padding-left: 18px;
    line-height: 40px;
    font-size: 18px;
    color: #333;
  }
  .contentBox {
    padding-top: 10px;
    .el-row {
      padding: 0 20px;
      font-size: 14px;
      height: 40px;
      line-height: 40px;
      .el-col {
        height: 40px;
        line-height: 40px;
      }
      &:nth-child(odd) {
        background: #f5f7fb;
      }
      &:nth-child(even) {
        border-bottom: 1px solid #f7f9ff;
      }
      &:last-child {
        background: none;
      }
    }
  }
  .noData {
    margin-top: 80px;
    text-align: center;
  }
}
.policyBox {
  height: 424px;
  margin-top: 10px;
  padding: 10px 15px;
  background: #fff;
  .titleWord {
    padding-left: 18px;
    line-height: 40px;
    font-size: 18px;
    color: #333;
  }
  .noData {
    text-align: center;
    margin-top: 160px;
  }
  .contentBox {
    padding-top: 10px;
    font-size: 14px;
    li {
      cursor: pointer;
      position: relative;
      padding: 12px 16px;
      line-height: 24px;
      &:nth-child(odd) {
        background: #f5f7fb;
      }
      .seeContent {
        width: 77px;
        position: absolute;
        right: 10px;
        bottom: 10px;
      }
    }
  }
}
.container {
  background: #f5f7fa;
  .titleWrap {
    background: #fff;
    padding: 16px 24px 22px 16px;
    position: relative;
    font-size: 14px;
    color: #333;
    position: relative;
    .backBtn {
      position: absolute;
      cursor: pointer;
      left: 24px;
      top: 23px;
      font-size: 18px;
      font-weight: bold;
      width: 18px;
      height: 24px;
      margin-right: 6px;
      .iconfanhui1 {
        margin-right: 0;
      }
    }
    .projectName {
      font: bold 18px Microsoft YaHei;
      color: #333333;
      line-height: 20px;
      margin-bottom: 10px;
      .projectState {
        display: inline-block;
        width: 60px;
        height: 20px;
        font-size: 12px;
        color: #fff;
        text-align: center;
        margin-left: 10px;
        font-weight: normal;
      }
    }
    .explain {
      font-size: 14px;
      color: #666;
      // margin-top: 10px;
      padding-left: 16px;
      line-height: 40px;
    }
    .titleBottom {
      display: inline-block;
      line-height: 20px;
      height: 20px;
      padding-left: 16px;
    }
    .topBtn {
      position: absolute;
      top: 40px;
      right: 120px;
      .greenBack {
        border-color: #009588;
      }
    }
    .gradeImgBox {
      position: absolute;
      top: 20px;
      right: 24px;
      .gradeImgCss {
        width: 80px;
        height: 80px;
      }
    }
    .previewBox {
      width: 56px;
      height: 20px;
      position: relative;
      .previewImg {
        position: absolute;
        top: 25px;
        left: 0;
        cursor: pointer;
        /deep/.el-image__preview {
          opacity: 0;
        }
      }
    }
    /deep/.el-upload-list {
      display: none;
    }
  }
  .topTip {
    margin-top: 10px;
    width: 100%;
    font-size: 14px;
    .dangerBox {
      border: 1px solid #e02020;
      height: 34px;
      line-height: 34px;
      position: relative;
      .leftBox {
        font-size: 16px;
        position: absolute;
        left: 0;
        width: 75px;
        height: 100%;
        text-align: center;
        background-color: #e02020;
        color: #fff;
      }
      .rightBox {
        margin-left: 75px;
        padding: 0 20px;
        height: 100%;
        color: #666;
        background-color: rgba(224, 32, 32, 0.05);
      }
    }
  }
  .mainSection {
    position: relative;
    margin-top: 10px;
    .rightSection {
      .fade-enter-active,
      .fade-leave-active {
        transition: opacity 0.3s;
      }
      .fade-enter, .fade-leave-to /* .fade-leave-active, 2.1.8 版本以下 */ {
        opacity: 0;
      }
      .boxShadow {
        box-shadow: -2px 4px 8px rgba(0, 0, 0, 0.1);
      }
      // height: 1000px;
      // position: absolute;
      // right: 0px;
      // top: 0px;
      display: inline-block;
      width: 422px;
      vertical-align: top;
      margin-left: 5px;
      /deep/ .qrcode {
        position: fixed;
        width: 60px;
        top: 296px;
        right: 10px;
        z-index: 9999;
      }
      // 快捷功能+二维码
      .functionAndQrcodeBox {
        width: 422px;
        height: 154px;
        .functionBox {
          width: 422px;
          height: 100%;
          margin-right: 10px;
          padding: 20px 32px;
          background-color: #fff;
          .functionBtn {
            margin-top: 20px;
            .el-button {
              width: 158px;
              height: 60px;
              background: rgba(0, 149, 136, 0.65);
              border-radius: 8px;
              border-radius: 8px;
              border: none;
              font-size: 20px;
              /deep/.iconfont {
                margin-right: 10px;
              }
            }
          }
        }
      }
      // 保证金
      .bzjBox {
        height: 322px;
        background: #fff;
        margin-top: 10px;
        padding: 24px 32px;
        .title {
          font-size: 18px;
          margin-bottom: 12px;
        }
        .labelWidth {
          font-size: 14px;
          color: #333;
          display: inline-block;
          height: 32px;
        }
        .information {
          font-size: 14px;
          color: #666;
        }
        .noDeposit {
          p {
            color: #2a2a2a;
            margin-top: 110px;
            text-align: center;
          }
        }
      }
      .insuranceBox {
        // height:524px;
        background-color: #fff;
        margin-top: 10px;
        font-size: 14px;
        .titleBox {
          height: 58px;
          line-height: 58px;
          padding: 0 32px;
          // background:#E4EBF1;
          margin-bottom: 0px;
          .modularTitle {
            line-height: 58px;
          }
          .el-link {
            vertical-align: top;
          }
        }
        .contentBox {
          padding: 0 32px;
          ul li {
            height: 32px;
            line-height: 32px;
            label {
              color: #333;
              display: inline-block;
              width: 90px;
              text-align: right;
            }
            span {
              color: #2a2a2a;
            }
          }
          .borderUl {
            border: 1px dotted #d5dee7;
            border-width: 1px 0px;
            margin: 15px 0px;
            padding: 15px 0px;
          }
        }
      }
      .insuranceBox {
        height: 264px;
        position: relative;
        .contentBox {
          ul li {
            label {
              width: 70px;
            }
          }
          .addInsurance {
            position: absolute;
            right: 32px;
            bottom: 36px;
          }
          .noInsurance p {
            color: #e02020;
            font-size: 18px;
            text-align: center;
            margin-top: 45px;
            i {
              font-size: 32px;
              margin-right: 10px;
              vertical-align: middle;
            }
          }
        }
      }
    }
    .qrcodeBox {
      position: fixed;
      right: 0;
      z-index: 9999;
      width: 220px;
      height: 348px;
      background: #fff;
      padding: 20px 25px;
      border-radius: 0 0 0 30px;
      .qrcodeTwo {
        position: fixed;
        width: 60px;
        top: 303px;
        right: 206px;
      }
      img {
        width: 170px;
      }
      .content {
        font-size: 12px;
        color: #333333;
        line-height: 21px;
        margin-top: 4px;
        .driveDownload {
          color: #409eff;
          font-size: 11px;
          margin-top: 10px;
          border-bottom: 1px solid #409eff;
          text-align: center;
          &:hover {
            color: #0070f5;
            border-bottom: 1px solid #0070f5;
          }
        }
      }
    }
    .contentLeft {
      display: inline-block;
      width: calc(100% - 432px);
      // margin-right: 432px;
      // // position: relative;
      // .scoreLeft {
      //     margin-left: 0px !important;
      //     margin-right: 0px !important;
      // }
      .xfButton {
        margin-top: 30px;
        color: #009588;
        border: 1px solid #009588;
        padding: 10px 20px;
        &:hover {
          background: rgba(0, 149, 136, 0.1);
        }
      }
      // 代办事项
      .todoBox {
        // width: 422px;
        height: 274px;
        // margin-top: 10px;
        background-color: #ffffff;
        position: relative;
        /deep/ .el-tabs__header {
          margin: 0;
        }
        /deep/.el-tabs {
          .el-tabs__nav-wrap {
            height: 58px;
            padding: 0 32px;
            padding-top: 6px;
            // background: #E4EBF1;
            .el-tabs__item {
              color: #666;
            }
            .el-tabs__item.is-active {
              color: #009588;
            }
            .el-tabs__active-bar {
              background-color: #409eff !important;
            }
            .el-tabs__nav {
              float: right;
            }
          }
          .el-tabs__nav-wrap::after {
            display: none;
          }
        }
        .modularTitle {
          position: absolute;
          left: 32px;
          top: 19px;
          z-index: 100;
          font-size: 18px;
        }
        .noData {
          margin-top: 70px;
        }
        // .todoContentBox {
        //     padding: 0 16px;
        //     font-size: 14px;
        //     .el-row {
        //         height: 40px;
        //         line-height: 40px;
        //         padding: 0 20px;
        //         .dealing {
        //             color: #ffb649;
        //         }
        //         .noDeal {
        //             color: #e02020;
        //         }
        //     }
        //     .el-row:nth-child(odd) {
        //         background: #f5f7fb;
        //     }
        // }
        // .moreLink {
        //     padding: 0 16px;
        //     background: #fff !important;
        //     border-top: 1px solid #d5dee7;
        //     line-height: 50px;
        // }
        .todoContentBox {
          padding: 0 16px;
          font-size: 14px;
          li {
            height: 40px;
            line-height: 40px;
            padding: 0 20px;
            .dealing {
              color: #ffb649;
            }
            .noDeal {
              color: #e02020;
            }
            &:nth-child(odd) {
              background: #f5f7fb;
            }
            &:nth-child(even) {
              border-bottom: 2px solid #f5f7fb;
            }
          }
        }
        .moreLink {
          margin-top: 10px;
        }
      }
      .scoreLeft,
      .accountBox,
      .reactBox,
      .salaryBox,
      .attBox {
        .title {
          font-size: 18px;
        }
        background: #fff;
        margin-bottom: 10px;
        padding: 20px 32px;
        .keyWrapper {
          .keyBox {
            height: 92px;
            float: left;
            width: 31.33333333%;
            background: #f5f7fb;
            margin-top: 20px;
            border-radius: 4px;
            text-align: center;
            padding: 18px 0;
            .keyName {
              font-size: 14px;
              color: #666;
              line-height: 21px;
            }
            .quantity {
              color: #009588;
              font-weight: bold;
              font-size: 28px;
              line-height: 36px;
            }
          }
          .keyBox:nth-child(3n-1) {
            margin-left: 3%;
            margin-right: 3%;
          }
        }
      }
      .scoreBox {
        height: 274px;
        margin-bottom: 0px;
        .scoreLeft {
          height: 274px;
          padding-right: 32px;
          text-align: center;
          border-right: 10px solid #f5f7fb;
          .projectLevel {
            margin-top: 30px;
            width: 100px;
          }
        }
      }
      .accountBox {
        height: 288px;
        position: relative;
        .noAccount {
          padding-top: 90px;
          text-align: center;
        }
        .accountLeft {
          margin-top: 20px;
          height: 184px;
          padding: 20px 20px;
          background: #f5f7fb;
          border: 1px solid #dee5f4;
          border-right: none;
          li {
            line-height: 34px;
            .label {
              font-size: 14px;
              color: #999999;
              margin-right: 4px;
            }
            .information {
              font-size: 14px;
              color: #333333;
            }
          }
        }
        .accountRight {
          margin-top: 20px;
          .bankInfo {
            width: 100%;
            height: 184px;
            padding: 24px 20px;
            border: 1px solid #dee5f4;
            .payoff div {
              width: 50%;
              float: left;
              margin-bottom: 20px;
              border-bottom: 1px solid #dee5f4;
            }
            .color999 {
              font-size: 14px;
            }
            .moneyAll {
              font-size: 22px;
              color: #009588;
              line-height: 35px;
            }
            .moneyLittle {
              font-size: 22px;
              color: #333;
              line-height: 35px;
            }
          }
        }
      }
      .reactBox {
        height: 298px;
        position: relative;
      }
      .salaryBox {
        height: 304px;
        position: relative;
        margin-bottom: 0px;
        .smallTitle {
          font-size: 14px;
          color: #999999;
        }
        .noSalary {
          p {
            color: #2a2a2a;
            margin-top: 100px;
            text-align: center;
          }
        }
      }
      .bzjBox {
        height: 210px;
        .title {
          margin-bottom: 20px;
        }
        .labelWidth {
          font-size: 14px;
          color: #333;
          display: inline-block;
          height: 34px;
        }
        .information {
          font-size: 14px;
          color: #666;
        }
        .noDeposit {
          p {
            color: #2a2a2a;
            margin-top: 60px;
            text-align: center;
          }
        }
      }
      .attBox {
        height: 334px;
        position: relative;
        .attDataBox {
          .leftBox {
            width: 30%;
            li {
              margin-bottom: 10px;
            }

            .content {
              font-size: 14px;
              color: #009588;
            }
          }
          .rightBox {
            width: 66%;
          }
          .centerBox {
            width: 24%;
            ul {
              padding-top: 60px;
              padding-left: 24px;
              li {
                margin-bottom: 8px;
              }
              span {
                font-size: 14px;
                color: #485465;
                margin-left: 5%;
              }
            }
          }
          .todayAtt {
            height: 180px;
            // width: 200px;
            position: relative;
            left: 50%;
            transform: translateX(-50%);
            -ms-transform: translateX(-50%); /* IE 9 */
            -moz-transform: translateX(-50%); /* Firefox */
            -webkit-transform: translateX(-50%); /* Safari 和 Chrome */
            -o-transform: translateX(-50%);
          }
        }
      }
      .noRealName {
        p {
          color: #e02020;
          font-size: 18px;
          text-align: center;
          margin-top: 90px;
          i {
            font-size: 32px;
            margin-right: 10px;
            vertical-align: middle;
          }
        }
        .addEmployee {
          position: absolute;
          right: 32px;
          bottom: 24px;
        }
      }
      @media screen and (min-width: 1280px) and (max-width: 1440px) {
        .fontSize {
          font-size: 12px !important;
        }
      }
      @media screen and (min-width: 1440px) {
        .keyName {
          font-size: 16px !important;
        }
      }
    }
  }
}
// 二维码
@media screen and (max-width: 1400px) {
  .qrcode {
    top: 196px !important;
  }
  .qrcodeBox {
    top: 215px !important;
  }
  .qrcodeTwo {
    top: 203px !important;
  }
}
.historyChange {
  font-size: 14px;
  cursor: pointer;
  color: #409eff;
  &:hover {
    text-decoration: underline;
  }
}
.clearfix:after {
  content: '.'; /*加一段内容*/
  display: block; /*让生成的元素以块级元素显示，占满剩余空间*/
  height: 0; /*避免生成的内容破坏原有布局高度*/
  clear: both; /*清除浮动*/
  visibility: hidden; /*让生成的内容不可见*/
}
.clearfix {
  zoom: 1; /*为IE6，7的兼容性设置*/
}
.a_link {
  color: #409eff;
}
.mouseOn {
  cursor: pointer;
}

// 所属单位向下箭头与文字不在一行显示问题
/deep/ .el-table .el-table__expand-icon {
  float: left;
}
.backPay {
  width: 100%;
  height: 42px;
  // margin-top: 10px;
  margin-bottom: 10px;
  padding-left: 20px;
  padding-right: 120px;
  line-height: 42px;
  background-color: #fff;
  position: relative;
  .lookMore {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    margin: auto;
  }
  .warn {
    color: #f56c6c;
  }
  .infoBox {
    width: 100%;
    height: 42px;
    overflow: hidden;
    .subBox {
      width: auto;
      white-space: nowrap;
      display: inline-block;
      zoom: 1;
      .info {
        padding-right: 40px;
        display: inline-block;
        .desc {
          color: #666;
        }
      }
    }
  }
}
.labelTitle {
  font-size: 14px;
  color: #3a3a3a;
}
.miniStart {
  height: 20px;
  line-height: 20px;
  background-color: #fff;
  color: #265faa !important;
  border: 1px solid #265faa !important;
  // transform: translateY(1.5px);
  margin-right: 10px;
  vertical-align: bottom;
}
</style>
